// 创建一个类
// class Show {
//     constructor(id, teaName, teaType, teaImg, teaPrice, teaDescribe) {
//         this.id = id;
//         this.teaName = teaName;
//         this.teaType = teaType;
//         this.teaImg = teaImg;
//         this.teaPrice = teaPrice;
//         this.teaDescribe = teaDescribe;
//     }
// }

// 回显
window.onload = function() {
        // 发送ajax请求
        $.ajax({
            // 1.发送请求类型
            type: "post",
            // 2.接口路径
            url: "/js/firstPage",
            // 3.是否携带参数
            data: null,
            // 4.返回数据类型
            dataType: "json",
            // 5.回调函数 data表示后台接口返回的数据
            success: function(data) {
                // 获取父元素
                let divobj = document.getElementById("tea");
                let s = "";
                // 判断本地存储是否为空
                if (data == "" || data == null || data == undefined || data == []) {
                    divobj.innerHTML = s;
                } else {
                    // 将本地存储转为json对象
                    let teaArr = JSON.parse(data);
                    // 遍历
                    for (let i = 0; i < teaArr.length; i++) {
                        s += `<div class="article_div">`;
                        s += `<img src="../img/${teaArr[i].teaImg}" alt="" onclick='teaDescribe(\"${teaArr[i].teaName}\")'>`;
                        s += ` <div class="article_a">${teaArr[i].teaName}</div>`;
                        s += `<p>￥${teaArr[i].teaPrice}</p>`;
                        s += `<span class="iconfont icon-arrow-right-full" onclick='teaDescribe(\"${teaArr[i].teaName}\")'></span>`;
                        s += `</div>`;
                    }
                    divobj.innerHTML = s;
                }

            }
        })

        // document.onscroll = function() {
        //     let top = parseInt(document.documentElement.scrollTop);
        //     console.log(top);
        //     // let imglist = document.querySelectorAll(".article_div");
        //     if (top >= 100) {
        //         document.getElementById("tea").style.animation = "animation 1s linear forwards";
        //     }
        // }
    }
    // let ulobj = document.getElementById("ul");
    // console.log(ulobj);
    // alert(ulobj)
    // let liist = ulobj.getElementsByTagName("li")[1];
    // 点击事件
    // let teaType = 0;
function change(teaType) {
    // debugger
    console.log(teaType);
    if (teaType == 7) {
        // 刷新当前页面
        location.reload();
    } else {
        let obj = {
                teaType: teaType
            }
            // 获取ul标签对象
        let divobj = document.getElementById("tea");
        // 发送ajax请求
        $.ajax({
            // 1.发送请求类型
            type: "post",
            // 2.接口路径
            url: "/js/teaPage",
            // 3.是否携带参数
            data: JSON.stringify(obj),
            // 4.返回数据类型
            dataType: "json",
            // 5.回调函数 data表示后台接口返回的数据
            success: function(teaArr) {
                let s = "";
                divobj.innerHTML = s;
                // 遍历
                for (let i = 0; i < teaArr.length; i++) {
                    // s += `<div class="article_div">`;
                    // s += `<img src="../img/${teaArr[i].teaImg}" alt="" onclick='teaDescribe(\"${teaArr[i].teaName}\")'>`;
                    // s += ` <div class="article_a"><a href="#">${teaArr[i].teaName}</a></div>`;
                    // s += `<p>￥${teaArr[i].teaPrice}</p>`;
                    // s += `<span class="iconfont icon-arrow-right-full" onclick='teaDescribe(\"${teaArr[i].teaName}\")'></span>`;
                    // s += `</div>`;
                    s += `<div class="article_div">`;
                    s += `<img src="../img/${teaArr[i].teaImg}" alt="" onclick='teaDescribe(\"${teaArr[i].teaName}\")'>`;
                    s += ` <div class="article_a">${teaArr[i].teaName}</div>`;
                    s += `<p>￥${teaArr[i].teaPrice}</p>`;
                    s += `<span class="iconfont icon-arrow-right-full" onclick='teaDescribe(\"${teaArr[i].teaName}\")'></span>`;
                    s += `</div>`;
                }
                divobj.innerHTML = s;
            }
        })
    }
}

// 进入茶叶描述
function teaDescribe(teaName) {
    console.log(teaName);
    // 获取本地存储 转为json对象
    let teaarr = JSON.parse(localStorage.Tea);
    let showteapage = [];
    for (let i = 0; i < teaarr.length; i++) {
        if (teaarr[i].teaName == teaName) {
            showteapage.push(teaarr[i]);
        }
    }
    // 创建新的本地存储
    localStorage.showTeaPage = JSON.stringify(showteapage);
    // 跳转到茶叶描述页面
    location.href = "09-茶叶描述.html";
}